<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form method="post" action="/ajax/registerServlet">
    用户名:<input type="text" name="username">
    密码：<input type="password" name="pwd">
    手机号：<input type="text" name="phone"/>
    <input type="submit" value="submit">
    <button type="button">ajax提交</button>
</form>



</body>
</html>
<script src="js/jquery-3.0.0.min.js"></script>
<script>
$(function () {
    $('button').click(function () {
        // ajax发送请求时，客户端给服务端的数据，有三种方式：表单，FormData，JSON
        // 表单时，有三种方式
        // 字符串形式：name=value&name1=value1
        // 对象形式
        // 调用表单的序列化方法
        // alert('ok')
        //
        let username = $("input[name=username]").val();
        let pwd = $("input[name=pwd]").val();
        // 表单格式的字符串
        let str = 'username='+username+"&pwd="+pwd
        // 对象形式
        let name = username
        // jQuery会将这个对象转换为上面的字符串形式
        let obj = {
            'username':name,
            'pwd':pwd
        }
        // 调用表单的序列化方法,将表单中的输入框，转换为表单数据格式：name=value&name1=value1
        let str2 = $('form').serialize()
        console.log(str2)
        $.ajax({
            url:'/ajax/registerServlet',
            type:'post',
            data: str2,          // 客户端传给服务端的数据
            dataType:'text',
            success:function (response) {
                alert(response)
            }
        })

    })
})
</script>